<!DOCTYPE html>
<html>
<head lang="en">
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>员工新增</title>
    <script type="text/javascript" src="resources/js/jquery-1.11.3.min.js"></script>
    <script type="text/javascript" src="resources/js/jquery.param.js"></script>
    <style type="text/css">
        <!-- 清除样式 -->
        body{font:13px/26px "微软雅黑";}
		.main{width:720px;background:#F1F1F1;margin:20px auto;padding:10px;}
        .main_list h2{font-size:18px;font-weight:bold;}
		.main_list label{font-size:14px;}
		.main_list ul {width:720px;list-style-type:none;list-style-position:outside;padding:0px;}
		.main_list li{padding:12px; border-bottom:1px solid #DFDFDF;position:relative;} 
		.main_list li:first-child, .main_list li:last-child {border-bottom:1px solid #777;}
		.main_list h2 {margin:0;display: inline;}
		.main_list label {width:150px;margin-top: 3px;display:inline-block;float:left;padding:3px;}
		.main_list input[type=text] input[type=date] {height:20px; width:220px; padding:5px 8px;}
		.main_list button {margin-left:156px;}
		.main_list button.add {margin-left:55px;}
		.main_list button.back {margin-left:55px;}
		.main_list input[type=text] input[type=date] {
			border:1px solid #aaa;
			box-shadow: 0px 0px 3px #ccc, 0 10px 15px #eee inset;
			border-radius:2px;
			padding-right:30px;
			-moz-transition: padding .25s; 
			-webkit-transition: padding .25s; 
			-o-transition: padding .25s;
			transition: padding .25s;
		}
    </style>
</head>
<body>
<div class="main">
	<div class="main_list">
		<ul>
			<li>
				<h2>员工修改</h2>
			</li>
			<li>
				<label>员工姓名:</label>
				<input id="ename" type="text" />
			</li>
			<li>
				<label>性别:</label>
				<input type="radio" name="sex" value="0" /> 男
				<input type="radio" name="sex" value="1" /> 女
			</li>
			<li>
				<label>出生日期:</label>
				<input id="birthday" type="date"/>
			</li>
			<li>
				<label>入职日期:</label>
				<input id="joinDate" type="date" />
			</li>
			<li>
				<label>员工编号:</label>
				<input id="eno" type="text" />
			</li>
			<li>
				<button id="add" type="submit">新增</button>
				<button id="back" type="button" onclick="javascript:history.back(-1)">返回</button>
			</li>
		</ul>
	</div>
</div>
</body>
<script>
    $(function(){

		$("#add").on("click", function() {
			var ename = $("#ename").val();
			var sex = $("input:radio:checked").val();
			var birthday = $("#birthday").val();
			var joinDate = $("#joinDate").val();
			var eno = $("#eno").val();
			if (ename == null || ename == "") {
				alert("员工姓名不能为空");
				return false;
			}
			if (sex == null || sex == "") {
				alert("性别不能为空");
				return false;
			}
			if (birthday == null || birthday == "") {
				alert("出生日期不能为空");
				return false;
			}
			if (joinDate == null || joinDate == "") {
				alert("入职日期不能为空");
				return false;
			}
			if (eno == null || eno == "") {
				alert("员工编号不能为空");
				return false;
			}
			$.ajax({
				type: "POST",
				contentType: "application/x-www-form-urlencoded",
				url: "http://127.0.0.1:8080/employee_ssh/jsonType/addEmployee.do",
				data: {
					"ename": ename,
					"sex": sex,
					"birthday": birthday,
					"joinDate":joinDate,
					"eno": eno
				},
				xhrFields:{withCredentials:true},
				success:function(data) {
					if(data.msg == "ok") {
						window.location.href = "employee_list_json.html";
					} else {
						alert("获取员工信息失败");
					}
				},
				error:function(data) {
					alert("失败，原因为" + data.responseText);
				}
			});

		});

    });
</script>
</html>